<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>礼品管理</title>
    <link href="../css/base.css" rel="stylesheet" type="text/css">
    <link href="../css/admin.css" rel="stylesheet" type="text/css">
    <link href="../css/bootstrap.css" rel="stylesheet" type="text/css">
    <link href="../css/font-awesome.min.css" rel="stylesheet" type="text/css">
    <link href="../css/bootstrap-datetimepicker.min.css" rel="stylesheet">
    <style>
        body{
            background: #fff;
            padding:20px;
        }
    </style>
</head>
<body> 
    <div class="clearfix">
        <div class="fl mr20">筛选兑换信息：<input type="text" class="form-control d-ib exchange_btn" placeholder="双击筛选兑换信息"></div>

        <div class="fl mr20">
            <div class="input-daterange" data-plugin="datepicker">
                <div class="input-group">
                    <span class="fl">兑换时间：</span>			
                    <input type="text" class="form-control time fl" name="start" id="lz_dateStart" placeholder="请输入日期">
                    <span class="fl">　-　</span>
                    <input type="text" class="form-control time fl" name="end" id="lz_dateEnd" placeholder="请输入日期">							
                </div>									
            </div>
        </div>
        <div class="fl mr20">粉丝编号：<input type="text" class="form-control d-ib"></div>

        <div class="fl mr20"><button class="btn btn-info">搜索</button></div>

        <div class="fl">
            <button class="btn btn-warning">批量导出</button>
        </div>
    </div>
    

    

    

    <div style="width:85%">
        <div class="clearfix t_c">
            <label class="fl"><input type="checkbox">全选</label>
            <button class='btn btn-danger fl change_all_kinds' data-toggle="modal" data-target="#change_all_kinds" style="display:none;">批量修改分类</button>
        </div>
        <div class="t_c_tab table-responsive">
            <table class="table table-bordered table-hover">
                <thead>
                    <tr>
                        <th style="text-align:center;min-width: 80px;">会员编号</th>
                        <th style="text-align:center;min-width: 72px;">USERID</th>
                        <th style="text-align:center;min-width: 80px;">会员等级</th>
                        <th style="text-align:center;min-width: 70px;">兑换类型</th>
                        <th style="text-align:center;min-width: 70px;">状态</th>
                        <th style="text-align:center;min-width: 73px;">兑换积分</th>
                        <th style="text-align:center;min-width: 100px;">兑换信息</th>
                        <th style="text-align:center;min-width: 50px;">兑换时间</th>
                        <th style="text-align:center;min-width: 50px;">操作</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>180013</td>
                        <td>20008</td>
                        <td>1</td>
                        <td>积分兑换</td>
                        <td>等待颁奖</td>
                        <td>20000</td>
                        <td>地址、支付宝</td>
                        <td>2017-08-30</td>
                        <td>
                            <button class="btn btn-primary" data-toggle="modal" data-target="#prize_giving" onclick="emptyInput(this)">颁奖</button>
                            <button class="btn btn-primary" data-toggle="modal" data-target="#faile_info" onclick="emptyInput(this)">失败</button>
                        </td>
                    </tr>

                </tbody>
            </table>
        </div>
        
        
        <nav aria-label="Page navigation" class="clearfix navigation">
            <ul class="pagination fl">
                <li>
                    <a href="#" aria-label="Previous">
                        <span aria-hidden="true">首页</span>
                    </a>
                </li>
                <li><a href="#">1</a></li>
                <li><a href="#">2</a></li>
                <li><a href="#">3</a></li>
            </ul>
            <div class="pa">
                <input type="text"><span>跳转</span>
            </div>
         </nav> 
    </div>

    <!--颁奖信息弹窗-->
    <div id="prize_giving" class="modal fade in" data-backdrop="static">
        <div class="modal-dialog text-center">
            <div class="modal-body" style="background: #fff;border: 3px solid #4383f7;border-radius: 7px;">
                <div style="width:60%;margin: 0 auto;">
                     <i class="fa fa-remove fa-lg poa" data-dismiss="modal" style="color:#ccc;cursor:pointer;top:10%;right:5%"></i>
                    <textarea name="" id="" rows="3" placeholder="填写备注信息" class="form-control" style="resize:none;width:100%!important;"></textarea>
                    <button class="btn fff yes-btn btn-info" data-dismiss="modal">颁奖</button>
                </div>
            </div>
        </div>
    </div>

    <!--失败信息弹窗-->
    <div id="faile_info" class="modal fade in" data-backdrop="static">
        <div class="modal-dialog text-center">
            <div class="modal-body" style="background: #fff;border: 3px solid #4383f7;border-radius: 7px;">
                <div style="width:60%;margin: 0 auto;">
                     <i class="fa fa-remove fa-lg poa" data-dismiss="modal" style="color:#ccc;cursor:pointer;top:10%;right:5%"></i>
                    <textarea name="" id="" rows="3" placeholder="填写备注信息" class="form-control" style="resize:none;width:100%!important;"></textarea>
                    <button class="btn fff yes-btn btn-info" data-dismiss="modal">失败</button> 
                </div>
            </div>
        </div>
    </div>


    <!--筛选兑换信息弹窗-->
    <div id="change_all_kinds" class="modal fade in" data-backdrop="static">
        <div class="modal-dialog text-center">
            <div class="modal-body" style="background: #fff;border: 3px solid #4383f7;border-radius: 7px;height:200px;">
                <div style="width:60%;margin: 0 auto;">
                    <div class='mt10 text-center clearfix'>
                        <i class="fa fa-remove fa-lg poa" data-dismiss="modal" style="color:#ccc;cursor:pointer;top:10%;right:5%"></i>
                        <button class="btn fff yes-btn btn-info fl" data-dismiss="modal" style="margin:0 10px 0 80px;">选择</button> 
                        <select name="" id="" class="form-control d-ib fl">
                            <option value="">超值卡券</option>
                            <option value="">电子数码</option>
                            <option value="">家居生活</option>
                         </select>
                    </div>
                    
                </div>
            </div>
        </div>
    </div>
     <!--批量修改时间弹窗-->
    <div id="change_all_time" class="modal fade in" data-backdrop="static">
        <div class="modal-dialog text-center">
            <div class="modal-body" style="background: #fff;border: 3px solid #4383f7;border-radius: 7px;">
                <div style="width:60%;margin: 0 auto;">
                    <div class="input-daterange" data-plugin="datepicker">
						<div class="input-group">
                            <span class='fl'>活动开始时间：</span>			
							<input type="text" class="form-control time" name="start" id="lz_dateStart"  placeholder="请输入日期">						
						</div>					
						<div class="input-group">	
                            <span class='fl'>活动结束时间：</span>					
							<input type="text" class="form-control time" name="end" id="lz_dateEnd"  placeholder="请输入日期" >						
						</div>					
					</div>		
                    <button class="btn fff yes-btn btn-info" data-dismiss="modal">确定</button> 
                </div>
            </div>
        </div>
    </div>
    <!--批量修改积分弹窗-->
    <div id="change_all_score" class="modal fade in" data-backdrop="static">
        <div class="modal-dialog text-center">
            <div class="modal-body" style="background: #fff;border: 3px solid #4383f7;border-radius: 7px;">
                <div style="width:60%;margin: 0 auto;">
                    <p class="mt10">修改积分<input type="number" class="form-control d-ib"></p>
                    <p class='mt10'>1元等于1积分</p>
                    <button class="btn fff yes-btn btn-info" data-dismiss="modal">确定</button> 
                </div>
            </div>
        </div>
    </div>
</body>
</html>
<script src="../js/common/jquery-1.11.3.min.js"></script>
<script src="../js/common/bootstrap.js"></script>
<script src="../js/common/bootbox.js"></script>
<script src="../js/common/bootstrap-datetimepicker.min.js"></script>
<script src="../js/common/bootstrap-datetimepicker.zh-CN.js"></script>
<script>
	/*时间插件*/
	$('#lz_dateStart').datetimepicker({
		language: 'zh-CN',
		format:'yyyy-mm-dd hh:ii:ss',
		initialDate:new Date(), //初始化
		minView:'hour',
		autoclose:true,
		todayBtn:true
	});
	$('#lz_dateEnd').datetimepicker({
		language: 'zh-CN',
		format:'yyyy-mm-dd hh:ii:ss',
		initialDate:new Date(),//初始化
		minView:'hour',
		autoclose:true
	});

    //双击筛选兑换信输入框-触发弹窗
    $('.exchange_btn').dblclick(function() {
        $('.change_all_kinds').click()
    })

     //每次点击bt弹窗清除input的保留的数据
    function emptyInput(ele) {
        $($(ele).attr('data-target')).find('input').val('');
        $($(ele).attr('data-target')).find('input[type=checkbox]').removeAttr('checked')
    }

     
</script>





































